<?php
$this->registerCssFile('@web/css/easyui.css');
$this->registerCssFile('@web/css/icon.css');
$this->registerJsFile('@web/js/jquery-1.6.1.min.js',['position' =>\yii\web\View::POS_END]);
$this->registerJsFile('@web/js/jquery.easyui.min.js',['position' =>\yii\web\View::POS_END]);
//$this->registerJsFile('@web/js/jquery-1.10.1.min.js',['position' =>\yii\web\View::POS_END]);
?>
<style>
    .menu_lock{
        position: absolute;
        width: 100%;
        height: 585px;
        background-color:white;
        opacity:0.3;
        z-index:2;
        text-align:center;
        line-height:585px;
        color:#000000;
        display:none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
</style>
<div class = "menu_lock">请求过程中,请稍等......</div>
<div class="rbac-select" style="border: 3px solid ghostwhite;width: 45%;padding: 20px;float: left;background-color: white">
    <h4>权限节点</h4>
    <div class="itemContent" style="margin:20px;">
        <ul id="tt" class="easyui-tree" checkbox="true"> </ul>

        <div class="divindex">
        </div>
    </div>
</div>


<div class="rbac-select" style="border: 3px solid ghostwhite;width: 50%;padding: 20px;float: right">
    <h4>角色选择</h4>
    <div style="margin:20px;">
        <table class="table">
            <th>角色名称</th>
            <th>角色描述</th>
            <th>查看并设置权限</th>
            <?php foreach($roles as $k=>$v) {?>
                <tr style="cursor:pointer" class="trstyle" id="<?= $v->name?>">
                    <td><?= $v->name?></td>
                    <td><?= $v->description?></td>
                    <td><button class="btn btn-success" onclick="javascript:selectRole('<?= $v->name?>')">设置权限</button></td>
                </tr>
            <?php }?>

        </table>

        <button class="btn btn-success" style="width: 30%;margin: auto" onclick="javascript:postTo()">保存</button>
    </div>
</div>

<input type="hidden" name="_csrf" id='csrf' value="<?= Yii::$app->request->csrfToken ?>">

<script>
    var roleName = '';
    var  checkValue = "";
    function postTo()
    {
        setIndexItem();
        if(roleName==''){
            alert('您还未选择需要赋予权限的角色');return;
        }
        $('.menu_lock').show();
        var  treeArr1= $(".tree-checkbox1");
        var  menuId = new Array;
        var len1 = treeArr1.length;
        for(var i=0; i<len1; i++){
            menuId.push(treeArr1[i].closest(".tree-node").id);
        }

        var  treeArr2= $(".tree-checkbox2");
        var len2 = treeArr2.length;
        for(var i=0; i<len2; i++){
            menuId.push(treeArr2[i].closest(".tree-node").id);
        }
        var csrf  = $('#csrf').val();
        $.ajax(
            {
                url: '?r=rbac/item/permtorole',
                type: 'post',
                data: {_csrf: csrf, menuId: menuId,roleName:roleName},

                success: function (data) {
                    var re = eval('('+data+')');
                    if(re.code==200){
                        $(".trstyle").css('background-color','white');
                        $("#"+roleName).css('background-color','rgb(0,169,90)');
                        var csrf  = $('#csrf').val();
                        $('#tt').tree({
                            type: 'post',
                            data: {_csrf: csrf, name: roleName},
                            url: '?r=rbac/item/getmenuperm',
                        })
                    }
                }
            }
        )
    }

        function selectRole(name)
        {
            $(".trstyle").css('background-color','white');
            $(".ulindex").css('display','block');
            $("#"+name).css('background-color','rgb(0,169,90)');
            roleName = name;
            var csrf  = $('#csrf').val();
            $('#tt').tree({
                    type: 'post',
                    data: {_csrf: csrf, name: name},
                    url: '?r=rbac/item/getmenuperm',
             })

            //首页功能模块权限ajax
            $.ajax(
                {
                    url: '?r=rbac/item/indexitem',
                    type: 'post',
                    data: {_csrf: csrf, name: name},

                    success: function (data) {
                        var re = eval('('+data+')');
                        var html = '<ul class="ulindex" >';
                        if(re.code==200){
                            var len = re.data.length;
                            for(var i=0;i<len;i++) {
                                if(re.data[i].checked) {
                                    html += '<li style="list-style-type:none;"> <input class="index_item_name" value="'+re.data[i].item_name+'" name="index_item_name" type="checkbox" checked >'+re.data[i].item_name+' </li>';
                                } else {
                                    html += '<li style="list-style-type:none;"> <input class="index_item_name" value="'+re.data[i].item_name+'" name="index_item_name" type="checkbox">'+re.data[i].item_name+' </li>';
                                }
                            }
                        }
                        html +='</ul>';
                        $('.divindex').html(html);
                    }
                }
            )
        }

    /**
     * 设置首页功能权限
     */
    function setIndexItem()
    {
        fun();
        var csrf  = $('#csrf').val();
        $.ajax(
            {
                url: '?r=rbac/item/setindexitem',
                type: 'post',
                data: {_csrf: csrf,checkValue:checkValue,roleName:roleName},

                success: function (data) {
                    var re = eval('('+data+')');
                    if(re.code==200){
                        selectRole(roleName);
                    }
                }
            }
        )
    }

    /**
     * 获取选中值
     */
    function fun()
    {
        obj = document.getElementsByClassName("index_item_name");
        check_val = [];
        for(k in obj){
            if(obj[k].checked)
                check_val.push(obj[k].value);
        }
        checkValue = check_val;
    }
</script>
